import React from 'react';
import { css,Global } from '@emotion/core';
import EmoDefault from './pages/EmoDefult';
import CssFunc from './pages/CssFunc';
import CssPriority from './pages/CssPriority';
import CssComponent from './pages/CssComponent';
import CssComponentPri from './pages/CssComponentPri';
import CssReactComp from './pages/CssReactComp';
import CssFC from './pages/CssFC';
import CssNesting from './pages/CssNesting';
import CssAs from './pages/CssAs';
import CssComb from './pages/CssComb';
import CssGlobal from './pages/CssGlobal';
import CSSAnimation from './pages/CSSAnimation';
import CssTheme from './pages/CssTheme';
const globalStyles=css`
  body{
    margin:0;
  }
  a{
    text-decoration:none;
    background:yellow;
  }
`
function App() {
  return (
    <div >
      <Global styles={globalStyles}/>
      <EmoDefault />
      <CssFunc />
      <CssPriority /> 
      <CssComponent />
      <CssComponentPri />
      <CssReactComp />
      <CssFC />
      <CssNesting />
      <CssAs />
      <CssComb /> 
      <CssGlobal />
      <CSSAnimation />
      <CssTheme />
    </div>
  )
}

export default App;

